<template>
	<Card shadow>
	    <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="100">
	    	<Row>
	    		 <Col :xs="24" :sm="18" :md="12" :lg="12">
	    		 	<FormItem label="真实姓名" prop="name">
			            <Input v-model="formValidate.name" placeholder="真实姓名"></Input>
			        </FormItem>
	    		 </Col>
	    	</Row>
	    	<Row>
		        <Col :xs="24" :sm="18" :md="12" :lg="12">
			        <FormItem label="身份证号码" prop="idcard">
			            <Input v-model="formValidate.idcard" placeholder="身份证号码"></Input>
			        </FormItem>
		        </Col>
		    </Row>
		    <Row>
		        <Col :xs="24" :sm="18" :md="12" :lg="12">
			        <FormItem label="生日" prop="birthday">
			            <Input v-model="formValidate.birthday" placeholder="生日"></Input>
			        </FormItem>
		        </Col>
		    </Row>
		    <Row>
		        <Col :xs="24" :sm="18" :md="12" :lg="12">
			        <FormItem label="年龄" prop="age">
			            <Input v-model="formValidate.age" placeholder="年龄"></Input>
			        </FormItem>
		        </Col>
		    </Row>
	        <FormItem label="性别" prop="sex">
	            <RadioGroup v-model="formValidate.sex">
	                <Radio label="1">男</Radio>
	                <Radio label="0">女</Radio>
	            </RadioGroup>
	        </FormItem>
	        <Row>
		        <Col :xs="24" :sm="18" :md="12" :lg="12">
			        <FormItem label="城市" prop="city">
			            <Input v-model="formValidate.city" placeholder="城市"></Input>
			        </FormItem>
		        </Col>
		    </Row>
		    <Row>
		        <Col :xs="24" :sm="18" :md="12" :lg="12">
			        <FormItem label="密码" prop="password">
			            <Input v-model="formValidate.password" placeholder="密码"></Input>
			        </FormItem>
		        </Col>
		    </Row>
		    <Row>
		        <Col :xs="24" :sm="18" :md="12" :lg="12">
			        <FormItem label="电话" prop="phone">
			            <Input v-model="formValidate.phone" placeholder="电话"></Input>
			        </FormItem>
		        </Col>
		    </Row>
		    <FormItem label="是否启用" prop="status">
	            <RadioGroup v-model="formValidate.status">
	                <Radio label="1">启用</Radio>
	                <Radio label="0">禁用</Radio>
	            </RadioGroup>
	        </FormItem>
	        <FormItem>
	            <Button type="primary" @click="handleSubmit('formValidate')">保存</Button>
	            <Button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">取消</Button>
	        </FormItem>
	        
	    </Form>
    </Card>
</template>
<script>
    export default {
        data () {
            return {
                formValidate: { },
                id:'',
                ruleValidate: {
                    name: [
                        { required: true, pattern:/^[\u4E00-\u9FA5A-Za-z]+$/, message: '请输入真实姓名', trigger: 'blur' }
                    ],
                    idcard: [
                        { required: true, pattern:/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '请输入正确身份证号码', trigger: 'blur' },
                    ],
                    birthday: [
                        { required: true, pattern: /^(19|20)\d{2}-(1[0-2]|0?[1-9])-(0?[1-9]|[1-2][0-9]|3[0-1])$/, message: "请填写正确生日日期，年月日中间用'-'连接", trigger: 'blur'},
                    ],
                    age: [
                        { required: true, pattern:/^([0-9]|[0-9]{2}|120)$/, message: "请输入正确年龄", trigger: 'blur'},
                    ],
                    sex: [
                        { required: true, message: '请选择性别', trigger: 'change' }
                    ],
                    city: [
                        { required: true, pattern:/^[\u4e00-\u9fa5]+$/, message: '请填写正确城市', trigger: 'blur' }
                    ],
                    password: [
                        { required: false, pattern:/^(\w){6,16}$/, message: '请输入密码，密码必须由6-16个英文字母和数字组成', trigger: 'blur' }
                    ],
                    phone: [
                        { required: true, pattern:/^1(3|4|5|7|8)\d{9}$/,message: "请输入正确的电话号码",trigger: 'blur'},
                    ],
                    status: [
                        { required: true, message: "请选择启用状态", trigger: 'change' }
                    ]
                }
            }
        },
//      页面加载获取数据
        created:function(){
    		var id=this.$route.query.id
    		var that=this;
			this.axios({
	            method: 'get',
	            url: that.$store.state.app.globalUrl+'/admin/Examinee/getDetail?id='+id,
	            data: {
	            },
		    }).then(function(res){
		        that.formValidate=res.data.data.examinee;
		        that.formValidate.sex=that.formValidate.sex+"";
		        that.id=id;
		    })
	    },
        methods: {
//      	点击保存执行
            handleSubmit (name) {
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        var that=this;
						this.axios({
				            method: 'post',
				            url: that.$store.state.app.globalUrl+'/admin/Examinee/edit',
				            data: {
				            	name:that.formValidate.name,
				            	idcard:that.formValidate.idcard,
				            	birthday:that.formValidate.birthday,
				            	age:that.formValidate.age,
				            	sex:that.formValidate.sex,
				            	city:that.formValidate.city,
				            	password:that.formValidate.password,
				            	phone:that.formValidate.phone,
				            	status:that.formValidate.status,
				            	Id:that.id
				            }
				        }).then(function(res){
				        	that.$router.push({
				    			name: 'user-management'
				    		})
				    	})
                    } else {
                        this.$Message.error('请将信息填写完整!');
                    }
                })
            },
//          取消
            handleReset (name) {
                this.$router.push({
	    			name: 'user-management'
	    		})
            }
        }
    }
</script>
